<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>films</title>
    <link href="../css/films/films.css" rel="stylesheet">
    <link href="../css/header.css" rel="stylesheet">
<!--    <link href="../css/footer.css" rel="stylesheet">-->
    <link href="../dist/layui/css/layui.css" rel="stylesheet" media="all">
    <script src="../dist/layui/layui.js"></script>
    <script src="../js/jquery-3.6.0.min.js"></script>
</head>
<body>
    <div class="header">
        <div class="header-logo"><a href="#" class="logo"></a></div>
        <div class="header-nav">
            <ul>
                <li><a href="../index.html" class="">首页</a></li>
                <li class="checked"><a href="../films/films.html" class="">电影</a></li>
                <li><a href="../cinema/detail.html" class="">影院</a></li>
                <li><a href="../border/border.html" class="">榜单</a></li>
                <li><a href="../border/address.html" class="address">地区</a></li>
            </ul>
        </div>
        <div class="header-search">
            <form action="" class="search-form">
                <input type="text" class="keyword" placeholder="电影/影院 搜你所想">
                <a href="" class="search-btn"></a>
            </form>
            <div class="head-login">
                <a href="" class="login-btn">&nbsp;&nbsp;&nbsp;&nbsp;登录</a>
                <!--<span></span>-->
            </div>
        </div>
    </div>
    <div class="main">
        <div class="subnav">
            <ul>
                <li><a href="javascript:void(0)" class="nav-a">正在热映</a> </li>
                <li><a href="javascript:void(0)">即将上映</a> </li>
                <li><a href="javascript:void(0)">经典影片</a> </li>
            </ul>
        </div>
        <div class="container">
            <div class="tags-panel">
                <ul class="tags-lines">
                    <li>
                        <div class="tags-title">类型:</div>
                        <ul class="tags-line">
                            <li class="li-one"><a href="javascript:void(0)">全部</a></li>
                            <li><a href="javascript:void(0)">爱情</a></li>
                            <li><a href="javascript:void(0)">喜剧</a></li>
                            <li><a href="javascript:void(0)">动画</a></li>
                            <li><a href="javascript:void(0)">剧情</a></li>
                            <li><a href="javascript:void(0)">恐怖</a></li>
                            <li><a href="javascript:void(0)">惊悚</a></li>
                            <li><a href="javascript:void(0)">科幻</a></li>
                            <li><a href="javascript:void(0)">动作</a></li>
                            <li><a href="javascript:void(0)">悬疑</a></li>
                            <li><a href="javascript:void(0)">犯罪</a></li>
                            <li><a href="javascript:void(0)">冒险</a></li>
                            <li><a href="javascript:void(0)">奇幻</a></li>
                            <li><a href="javascript:void(0)">战争</a></li>
                            <li><a href="javascript:void(0)">运动</a></li>
                            <li><a href="javascript:void(0)">家庭</a></li>
                            <li><a href="javascript:void(0)">古装</a></li>
                            <li><a href="javascript:void(0)">武侠</a></li>
                            <li><a href="javascript:void(0)">西部</a></li>
                            <li><a href="javascript:void(0)">历史</a></li>
                            <li><a href="javascript:void(0)">传记</a></li>
                            <li><a href="javascript:void(0)">歌舞</a></li>
                            <li><a href="javascript:void(0)">短片</a></li>
                            <li><a href="javascript:void(0)">纪录片</a></li>
                            <li><a href="javascript:void(0)">戏曲</a></li>
                            <li><a href="javascript:void(0)">音乐</a></li>
                            <li><a href="javascript:void(0)">灾难</a></li>
                            <li><a href="javascript:void(0)">青春</a></li>
                            <li><a href="javascript:void(0)">儿童</a></li>
                            <li><a href="javascript:void(0)">其他</a></li>
                        </ul>
                    </li>
                    <li>
                        <div class="tags-title">区域:</div>
                        <ul class="tags-line">
                            <li class="li-one"><a href="javascript:void(0)">全部</a></li>
                            <li><a href="javascript:void(0)">中国</a></li>
                            <li><a href="javascript:void(0)">美国</a></li>
                            <li><a href="javascript:void(0)">韩国</a></li>
                            <li><a href="javascript:void(0)">日本</a></li>
                            <li><a href="javascript:void(0)">泰国</a></li>
                            <li><a href="javascript:void(0)">印度</a></li>
                            <li><a href="javascript:void(0)">法国</a></li>
                            <li><a href="javascript:void(0)">巴西</a></li>
                            <li><a href="javascript:void(0)">吐鲁番</a></li>
                            <li><a href="javascript:void(0)">英国</a></li>
                            <li><a href="javascript:void(0)">俄罗斯</a></li>
                            <li><a href="javascript:void(0)">意大利</a></li>
                            <li><a href="javascript:void(0)">西班牙</a></li>
                            <li><a href="javascript:void(0)">德国</a></li>
                            <li><a href="javascript:void(0)">波兰</a></li>
                            <li><a href="javascript:void(0)">其他</a></li>
                        </ul>
                    </li>
                    <li>
                        <div class="tags-title">年代:</div>
                        <ul class="tags-line">
                            <li class="li-one"><a href="javascript:void(0)">全部</a></li>
                            <li><a href="javascript:void(0)">2021</a></li>
                            <li><a href="javascript:void(0)">2020</a></li>
                            <li><a href="javascript:void(0)">2019</a></li>
                            <li><a href="javascript:void(0)">2018</a></li>
                            <li><a href="javascript:void(0)">2017</a></li>
                            <li><a href="javascript:void(0)">2016</a></li>
                            <li><a href="javascript:void(0)">2015</a></li>
                            <li><a href="javascript:void(0)">2014</a></li>
                            <li><a href="javascript:void(0)">2013</a></li>
                            <li><a href="javascript:void(0)">2012</a></li>
                            <li><a href="javascript:void(0)">2011</a></li>
                            <li><a href="javascript:void(0)">2010</a></li>
                            <li><a href="javascript:void(0)">2009</a></li>
                            <li><a href="javascript:void(0)">2008</a></li>
                            <li><a href="javascript:void(0)">2007</a></li>
                            <li><a href="javascript:void(0)">2006</a></li>
                            <li><a href="javascript:void(0)">2005</a></li>
                            <li><a href="javascript:void(0)">2004</a></li>
                            <li><a href="javascript:void(0)">2003</a></li>
                            <li><a href="javascript:void(0)">2002</a></li>
                            <li><a href="javascript:void(0)">2001</a></li>
                            <li><a href="javascript:void(0)">2000</a></li>
                            <li><a href="javascript:void(0)">90年代</a></li>
                            <li><a href="javascript:void(0)">80年代</a></li>
                            <li><a href="javascript:void(0)">更早</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
            <div class="moves-sorter">
                <ul>
                    <li>
                        <input type="radio" name="sorter">
                        <span>按热门排序</span>
                    </li>
                    <li>
                        <input type="radio" name="sorter">
                        <span>按时间排序</span>
                    </li>
                    <li>
                        <input type="radio" name="sorter">
                        <span>按评论排序</span>
                    </li>
                </ul>
            </div>
<!--            页面布局-->
            <div class="moves-list">
                    <ul>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie1.jpg"></a>
                            </div>
                            <a href="detail.html"><span>陪你很久很久</span></a>
                            <span>6.2</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie2.jpg"></a>
                            </div>
                            <a href="detail.html"><span>关于我妈的一切</span></a>
                            <span>9.2</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie3.jpg"></a>
                            </div>
                            <a href="detail.html"><span>我和我的父辈</span></a>
                            <span>9.6</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie4.jpg"></a>
                            </div>
                            <a href="detail.html"><span>长津湖</span></a>
                            <span>9.4</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie5.jpg"></a>
                            </div>
                            <a href="detail.html"><span>1950他们正年轻</span></a>
                            <span>9.6</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie6.jpg"></a>
                            </div>
                            <a href="detail.html"><span>中国医生</span></a>
                            <span>9.4</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie7.jpg"></a>
                            </div>
                            <a href="detail.html"><span>失控玩家</span></a>
                            <span>9.0</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie8.jpg"></a>
                            </div>
                            <a href="detail.html"><span>白蛇2:青蛇劫起</span></a>
                            <span>9.1</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie9.jpg"></a>
                            </div>
                            <a href="detail.html"><span>明日之战</span></a>
                            <span>8.6</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie10.jpg"></a>
                            </div>
                            <a href="detail.html"><span>我的青春有个你</span></a>
                            <span>7.9</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie11.jpg"></a>
                            </div>
                            <a href="detail.html"><span>盛夏未来</span></a>
                            <span>9.1</span>
                        </li>
                        <li>
                            <div class="movie">
                                <a href="detail.html"><img src="../images/films/movie12.jpg"></a>
                            </div>
                            <a href="detail.html"><span>妈妈的神奇小子</span></a>
                            <span>9.2</span>
                        </li>


                    </ul>
            </div>
<!--            电影分页-->
            <div class="pageinfo">
                <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
                </fieldset>

                 <div id="demo2"></div>
            </div>
        </div>
    </div>
<!--    尾部部分-->
    <!--========== 4.底部脚注 =============-->
    <div class="index-footer">
        <div class="footer-head"></div>
        <div class="footer-main">
            <p>关于视享票票通：&nbsp;关于我们<span>&nbsp;|&nbsp;</span> 管理团队 <span>&nbsp;|&nbsp;</span> 投资者关系
                &nbsp;&nbsp;友情链接 :&nbsp;&nbsp; 支付宝 </p>
            <p>
                商务合作邮箱：1137750012@qq.com &nbsp;
                客服电话：62170010 &nbsp;
                违法和不良信息/涉未成年人有害信息举报电话：4006018900
            </p>
            <p>
                用户举报/涉未成年人有害信息举报邮箱：tousujubao@shixiang.com&nbsp;
                舞弊线索举报邮箱：wubijubao@shixiang.com
            </p>
            <p>视享票票通用户服务协议<span>&nbsp;|&nbsp;</span>使用手册<span>&nbsp;|&nbsp;</span>隐私政策</p>
            <p>驰星视享文化传媒有限公司</p>
            <p>©&nbsp;2021&nbsp;视享票票通&nbsp;shixiang.com</p>
        </div>
    </div>

    <script>
        layui.use(['laypage', 'layer'], function() {
            var laypage = layui.laypage
                , layer = layui.layer;
            //自定义样式
            laypage.render({
                elem: 'demo2'
                , count: 60
                ,limit: 12
                , theme: '#47464a'
                ,first: '首页'
                ,last: '尾页'
                ,prev: '<em>←</em>'
                ,next: '<em>→</em>'
            });
        })
    </script>

    <script src="../js/films/films.js"></script>
</body>
</html>